<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>Common | 个人博客</title>
    <meta name="generator" content="VuePress 1.8.2">
    <link rel="icon" href="https://cdn.jsdelivr.net/gh/qqlcx5/figure-bed@v1.0.0/image/polar_bear.jpg">
    <script async="async" src="https://hm.baidu.com/hm.js?662dade0b3fe9911e80442e86935e233"></script>
    <meta name="description" content="前端博客,个人技术博客,前端,前端开发,前端框架,web前端,前端面试题,技术文档,学习,面试,JavaScript,js,ES6,TypeScript,vue,python,css3,html5,Node,git,github,markdown">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
    <meta name="keywords" content="前端博客,个人技术博客,前端,前端开发,前端框架,web前端,前端面试题,技术文档,学习,面试,JavaScript,js,ES6,TypeScript,vue,python,css3,html5,Node,git,github,markdown">
    <meta name="theme-color" content="#11a8cd">
    
    <link rel="preload" href="/saas-vuepress/assets/css/0.styles.b127ab38.css" as="style"><link rel="preload" href="/saas-vuepress/assets/js/app.fa9b9339.js" as="script"><link rel="preload" href="/saas-vuepress/assets/js/2.03dacb0b.js" as="script"><link rel="preload" href="/saas-vuepress/assets/js/56.f496ee38.js" as="script"><link rel="prefetch" href="/saas-vuepress/assets/js/10.694c1f9b.js"><link rel="prefetch" href="/saas-vuepress/assets/js/100.c7689fff.js"><link rel="prefetch" href="/saas-vuepress/assets/js/101.9af96cb7.js"><link rel="prefetch" href="/saas-vuepress/assets/js/102.99475b6f.js"><link rel="prefetch" href="/saas-vuepress/assets/js/103.c9d091f6.js"><link rel="prefetch" href="/saas-vuepress/assets/js/104.1009c720.js"><link rel="prefetch" href="/saas-vuepress/assets/js/105.d537fa90.js"><link rel="prefetch" href="/saas-vuepress/assets/js/106.98a4dabb.js"><link rel="prefetch" href="/saas-vuepress/assets/js/107.78b62d44.js"><link rel="prefetch" href="/saas-vuepress/assets/js/108.a267cb41.js"><link rel="prefetch" href="/saas-vuepress/assets/js/109.55d7058d.js"><link rel="prefetch" href="/saas-vuepress/assets/js/11.6a7519cb.js"><link rel="prefetch" href="/saas-vuepress/assets/js/110.df9942aa.js"><link rel="prefetch" href="/saas-vuepress/assets/js/111.7537b42c.js"><link rel="prefetch" href="/saas-vuepress/assets/js/112.7e2567b8.js"><link rel="prefetch" href="/saas-vuepress/assets/js/113.2cabdb03.js"><link rel="prefetch" href="/saas-vuepress/assets/js/114.3ab0f8ec.js"><link rel="prefetch" href="/saas-vuepress/assets/js/115.f61e8285.js"><link rel="prefetch" href="/saas-vuepress/assets/js/116.88a464e4.js"><link rel="prefetch" href="/saas-vuepress/assets/js/117.3b7c82dd.js"><link rel="prefetch" href="/saas-vuepress/assets/js/118.f457df12.js"><link rel="prefetch" href="/saas-vuepress/assets/js/119.c01d1cab.js"><link rel="prefetch" href="/saas-vuepress/assets/js/12.30ce9516.js"><link rel="prefetch" href="/saas-vuepress/assets/js/120.98c2000e.js"><link rel="prefetch" href="/saas-vuepress/assets/js/121.ceea03b1.js"><link rel="prefetch" href="/saas-vuepress/assets/js/122.820456eb.js"><link rel="prefetch" href="/saas-vuepress/assets/js/123.2c1d01b4.js"><link rel="prefetch" href="/saas-vuepress/assets/js/124.0bd539fd.js"><link rel="prefetch" href="/saas-vuepress/assets/js/125.23a0d200.js"><link rel="prefetch" href="/saas-vuepress/assets/js/126.8bdc3c39.js"><link rel="prefetch" href="/saas-vuepress/assets/js/127.17046da4.js"><link rel="prefetch" href="/saas-vuepress/assets/js/128.37bf9c00.js"><link rel="prefetch" href="/saas-vuepress/assets/js/129.aa8dd5e3.js"><link rel="prefetch" href="/saas-vuepress/assets/js/13.ee5d5b4c.js"><link rel="prefetch" href="/saas-vuepress/assets/js/130.c2683fa6.js"><link rel="prefetch" href="/saas-vuepress/assets/js/131.1fdb6791.js"><link rel="prefetch" href="/saas-vuepress/assets/js/14.950c6af7.js"><link rel="prefetch" href="/saas-vuepress/assets/js/15.80980eb9.js"><link rel="prefetch" href="/saas-vuepress/assets/js/16.1999adea.js"><link rel="prefetch" href="/saas-vuepress/assets/js/17.c7711021.js"><link rel="prefetch" href="/saas-vuepress/assets/js/18.25c22728.js"><link rel="prefetch" href="/saas-vuepress/assets/js/19.db7c38aa.js"><link rel="prefetch" href="/saas-vuepress/assets/js/20.b85fddaa.js"><link rel="prefetch" href="/saas-vuepress/assets/js/21.1db2aa08.js"><link rel="prefetch" href="/saas-vuepress/assets/js/22.836f2d02.js"><link rel="prefetch" href="/saas-vuepress/assets/js/23.bba7ac7b.js"><link rel="prefetch" href="/saas-vuepress/assets/js/24.c7032827.js"><link rel="prefetch" href="/saas-vuepress/assets/js/25.70228854.js"><link rel="prefetch" href="/saas-vuepress/assets/js/26.3ae08475.js"><link rel="prefetch" href="/saas-vuepress/assets/js/27.d4c45324.js"><link rel="prefetch" href="/saas-vuepress/assets/js/28.95438191.js"><link rel="prefetch" href="/saas-vuepress/assets/js/29.36d4e3da.js"><link rel="prefetch" href="/saas-vuepress/assets/js/3.85921ad7.js"><link rel="prefetch" href="/saas-vuepress/assets/js/30.291a3c91.js"><link rel="prefetch" href="/saas-vuepress/assets/js/31.b07e726b.js"><link rel="prefetch" href="/saas-vuepress/assets/js/32.dbb0082c.js"><link rel="prefetch" href="/saas-vuepress/assets/js/33.6dceddfe.js"><link rel="prefetch" href="/saas-vuepress/assets/js/34.4361e184.js"><link rel="prefetch" href="/saas-vuepress/assets/js/35.a8be0f9b.js"><link rel="prefetch" href="/saas-vuepress/assets/js/36.cf6c4bed.js"><link rel="prefetch" href="/saas-vuepress/assets/js/37.db8a983b.js"><link rel="prefetch" href="/saas-vuepress/assets/js/38.928e4457.js"><link rel="prefetch" href="/saas-vuepress/assets/js/39.ce656415.js"><link rel="prefetch" href="/saas-vuepress/assets/js/4.a540a415.js"><link rel="prefetch" href="/saas-vuepress/assets/js/40.015f7ed5.js"><link rel="prefetch" href="/saas-vuepress/assets/js/41.65efab94.js"><link rel="prefetch" href="/saas-vuepress/assets/js/42.e4b051b4.js"><link rel="prefetch" href="/saas-vuepress/assets/js/43.8b10d5db.js"><link rel="prefetch" href="/saas-vuepress/assets/js/44.b2659fd6.js"><link rel="prefetch" href="/saas-vuepress/assets/js/45.0a1871c7.js"><link rel="prefetch" href="/saas-vuepress/assets/js/46.ee674bf3.js"><link rel="prefetch" href="/saas-vuepress/assets/js/47.7461dfbb.js"><link rel="prefetch" href="/saas-vuepress/assets/js/48.a14b85e8.js"><link rel="prefetch" href="/saas-vuepress/assets/js/49.423ed53e.js"><link rel="prefetch" href="/saas-vuepress/assets/js/5.31489c9d.js"><link rel="prefetch" href="/saas-vuepress/assets/js/50.774f5f6a.js"><link rel="prefetch" href="/saas-vuepress/assets/js/51.1a5fc27c.js"><link rel="prefetch" href="/saas-vuepress/assets/js/52.adae1df6.js"><link rel="prefetch" href="/saas-vuepress/assets/js/53.a484c390.js"><link rel="prefetch" href="/saas-vuepress/assets/js/54.9077bcb6.js"><link rel="prefetch" href="/saas-vuepress/assets/js/55.d7ed3bf6.js"><link rel="prefetch" href="/saas-vuepress/assets/js/57.347b8e56.js"><link rel="prefetch" href="/saas-vuepress/assets/js/58.e299a281.js"><link rel="prefetch" href="/saas-vuepress/assets/js/59.aa26c2a0.js"><link rel="prefetch" href="/saas-vuepress/assets/js/6.3770f528.js"><link rel="prefetch" href="/saas-vuepress/assets/js/60.e5e36495.js"><link rel="prefetch" href="/saas-vuepress/assets/js/61.08bdec95.js"><link rel="prefetch" href="/saas-vuepress/assets/js/62.706b0f3e.js"><link rel="prefetch" href="/saas-vuepress/assets/js/63.030ae462.js"><link rel="prefetch" href="/saas-vuepress/assets/js/64.40830457.js"><link rel="prefetch" href="/saas-vuepress/assets/js/65.019b6b71.js"><link rel="prefetch" href="/saas-vuepress/assets/js/66.4233e242.js"><link rel="prefetch" href="/saas-vuepress/assets/js/67.8d22de74.js"><link rel="prefetch" href="/saas-vuepress/assets/js/68.44a5978e.js"><link rel="prefetch" href="/saas-vuepress/assets/js/69.0a559927.js"><link rel="prefetch" href="/saas-vuepress/assets/js/7.c9695630.js"><link rel="prefetch" href="/saas-vuepress/assets/js/70.c62d31fb.js"><link rel="prefetch" href="/saas-vuepress/assets/js/71.045cc192.js"><link rel="prefetch" href="/saas-vuepress/assets/js/72.ce37961a.js"><link rel="prefetch" href="/saas-vuepress/assets/js/73.af2893c7.js"><link rel="prefetch" href="/saas-vuepress/assets/js/74.f220272c.js"><link rel="prefetch" href="/saas-vuepress/assets/js/75.b531c409.js"><link rel="prefetch" href="/saas-vuepress/assets/js/76.919d7a27.js"><link rel="prefetch" href="/saas-vuepress/assets/js/77.ddab4b6d.js"><link rel="prefetch" href="/saas-vuepress/assets/js/78.70f1b9a2.js"><link rel="prefetch" href="/saas-vuepress/assets/js/79.816612ff.js"><link rel="prefetch" href="/saas-vuepress/assets/js/8.ddd1baf7.js"><link rel="prefetch" href="/saas-vuepress/assets/js/80.4f614128.js"><link rel="prefetch" href="/saas-vuepress/assets/js/81.064c7f61.js"><link rel="prefetch" href="/saas-vuepress/assets/js/82.b9ea733a.js"><link rel="prefetch" href="/saas-vuepress/assets/js/83.e7f64816.js"><link rel="prefetch" href="/saas-vuepress/assets/js/84.b255df78.js"><link rel="prefetch" href="/saas-vuepress/assets/js/85.35756ce8.js"><link rel="prefetch" href="/saas-vuepress/assets/js/86.19c8558a.js"><link rel="prefetch" href="/saas-vuepress/assets/js/87.aa6fa757.js"><link rel="prefetch" href="/saas-vuepress/assets/js/88.703dba52.js"><link rel="prefetch" href="/saas-vuepress/assets/js/89.6ce30efd.js"><link rel="prefetch" href="/saas-vuepress/assets/js/9.f77824c4.js"><link rel="prefetch" href="/saas-vuepress/assets/js/90.695919ef.js"><link rel="prefetch" href="/saas-vuepress/assets/js/91.3a6f04b2.js"><link rel="prefetch" href="/saas-vuepress/assets/js/92.c17ba399.js"><link rel="prefetch" href="/saas-vuepress/assets/js/93.7fd4aef1.js"><link rel="prefetch" href="/saas-vuepress/assets/js/94.d0f283fc.js"><link rel="prefetch" href="/saas-vuepress/assets/js/95.71759539.js"><link rel="prefetch" href="/saas-vuepress/assets/js/96.ffbe6ab0.js"><link rel="prefetch" href="/saas-vuepress/assets/js/97.13de9047.js"><link rel="prefetch" href="/saas-vuepress/assets/js/98.d8617209.js"><link rel="prefetch" href="/saas-vuepress/assets/js/99.3788669b.js">
    <link rel="stylesheet" href="/saas-vuepress/assets/css/0.styles.b127ab38.css">
  </head>
  <body>
    <div id="app" data-server-rendered="true"><div class="theme-container"><header class="navbar"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div> <a href="/saas-vuepress/" class="home-link router-link-active"><!----> <span class="site-name">个人博客</span></a> <div class="links"><div class="search-box"><input aria-label="Search" autocomplete="off" spellcheck="false" value=""> <!----></div> <nav class="nav-links can-hide"><div class="nav-item"><a href="/saas-vuepress/指南/10.基础/01.介绍.html" class="nav-link">
  指南
</a></div> <!----></nav></div></header> <div class="sidebar-mask"></div> <aside class="sidebar"><nav class="nav-links"><div class="nav-item"><a href="/saas-vuepress/指南/10.基础/01.介绍.html" class="nav-link">
  指南
</a></div> <!----></nav>  <ul class="sidebar-links"><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>基础</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/10.基础/01.介绍.html" class="sidebar-link">介绍</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>assets</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/20.assets/01.styles.html" class="sidebar-link">styles</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>common</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/30.common/01.components组件.html" class="sidebar-link">components组件</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>common-components</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/31.common-components/01.c-button.html" class="sidebar-link">c-button</a></li><li><a href="/saas-vuepress/指南/31.common-components/02.c-cell.html" class="sidebar-link">c-cell</a></li><li><a href="/saas-vuepress/指南/31.common-components/03.c-checkbox.html" class="sidebar-link">c-checkbox</a></li><li><a href="/saas-vuepress/指南/31.common-components/04.c-layout.html" class="sidebar-link">c-layout</a></li><li><a href="/saas-vuepress/指南/31.common-components/05.c-colors.html" class="sidebar-link">c-colors</a></li><li><a href="/saas-vuepress/指南/31.common-components/06.c-count-down.html" class="sidebar-link">c-count-down</a></li><li><a href="/saas-vuepress/指南/31.common-components/07.c-fixed-menu.html" class="sidebar-link">c-fixed-menu</a></li><li><a href="/saas-vuepress/指南/31.common-components/08.c-icons.html" class="sidebar-link">c-icons</a></li><li><a href="/saas-vuepress/指南/31.common-components/09.c-image.html" class="sidebar-link">c-image</a></li><li><a href="/saas-vuepress/指南/31.common-components/10.c-input.html" class="sidebar-link">c-input</a></li><li><a href="/saas-vuepress/指南/31.common-components/11.c-jyf-parser.html" class="sidebar-link">c-jyf-parser</a></li><li><a href="/saas-vuepress/指南/31.common-components/12.c-live-player.html" class="sidebar-link">c-live-player</a></li><li><a href="/saas-vuepress/指南/31.common-components/13.c-loading.html" class="sidebar-link">c-loading</a></li><li><a href="/saas-vuepress/指南/31.common-components/14.c-mask.html" class="sidebar-link">c-mask</a></li><li><a href="/saas-vuepress/指南/31.common-components/15.c-modal.html" class="sidebar-link">c-modal</a></li><li><a href="/saas-vuepress/指南/31.common-components/16.c-page-head.html" class="sidebar-link">c-page-head</a></li><li><a href="/saas-vuepress/指南/31.common-components/17.c-popup.html" class="sidebar-link">c-popup</a></li><li><a href="/saas-vuepress/指南/31.common-components/18.c-radio.html" class="sidebar-link">c-radio</a></li><li><a href="/saas-vuepress/指南/31.common-components/19.c-recommend.html" class="sidebar-link">c-recommend</a></li><li><a href="/saas-vuepress/指南/31.common-components/20.c-recommend-goods.html" class="sidebar-link">c-recommend-goods</a></li><li><a href="/saas-vuepress/指南/31.common-components/21.c-row.html" class="sidebar-link">c-row</a></li><li><a href="/saas-vuepress/指南/31.common-components/22.c-select-city.html" class="sidebar-link">c-select-city</a></li><li><a href="/saas-vuepress/指南/31.common-components/23.c-select-spec.html" class="sidebar-link">c-select-spec</a></li><li><a href="/saas-vuepress/指南/31.common-components/24.c-share-wechat.html" class="sidebar-link">c-share-wechat</a></li><li><a href="/saas-vuepress/指南/31.common-components/25.c-status-bar.html" class="sidebar-link">c-status-bar</a></li><li><a href="/saas-vuepress/指南/31.common-components/26.c-subscribe.html" class="sidebar-link">c-subscribe</a></li><li><a href="/saas-vuepress/指南/31.common-components/27.c-subsection.html" class="sidebar-link">c-subsection</a></li><li><a href="/saas-vuepress/指南/31.common-components/28.c-swipe-action.html" class="sidebar-link">c-swipe-action</a></li><li><a href="/saas-vuepress/指南/31.common-components/29.c-tabbar.html" class="sidebar-link">c-tabbar</a></li><li><a href="/saas-vuepress/指南/31.common-components/30.c-coupon-popup.html" class="sidebar-link">c-coupon-popup</a></li><li><a href="/saas-vuepress/指南/31.common-components/31.c-coupon-detail.html" class="sidebar-link">c-coupon-detail</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>common-config</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/32.common-config/01.index.html" class="sidebar-link">index</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>common-filters</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/33.common-filters/01.index.html" class="sidebar-link">index</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>common-mixins</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/34.common-mixins/06.globalMixins.html" class="sidebar-link">globalMixins</a></li><li><a href="/saas-vuepress/指南/34.common-mixins/07.list.html" class="sidebar-link">list</a></li><li><a href="/saas-vuepress/指南/34.common-mixins/08.pay.html" class="sidebar-link">pay</a></li><li><a href="/saas-vuepress/指南/34.common-mixins/09.pushMessage.html" class="sidebar-link">pushMessage</a></li><li><a href="/saas-vuepress/指南/34.common-mixins/10.realName.html" class="sidebar-link">realName</a></li><li><a href="/saas-vuepress/指南/34.common-mixins/11.share.html" class="sidebar-link">share</a></li><li><a href="/saas-vuepress/指南/34.common-mixins/12.shareMixins.html" class="sidebar-link">shareMixins</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>common-router</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/35.common-router/01.index.html" class="sidebar-link">index</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>common-service</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/36.common-service/01.index.html" class="sidebar-link">index</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>common-styles</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/37.common-styles/01.index.html" class="sidebar-link">index</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading open"><span>common-utils</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/38.common-utils/01.cavasTool.html" class="sidebar-link">cavasTool</a></li><li><a href="/saas-vuepress/指南/38.common-utils/02.colorGradient.html" class="sidebar-link">colorGradient</a></li><li><a href="/saas-vuepress/指南/38.common-utils/03.common.html" class="active sidebar-link">common</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/saas-vuepress/指南/38.common-utils/03.common.html#引用" class="sidebar-link">引用</a></li><li class="sidebar-sub-header"><a href="/saas-vuepress/指南/38.common-utils/03.common.html#showtoast" class="sidebar-link">showToast</a></li><li class="sidebar-sub-header"><a href="/saas-vuepress/指南/38.common-utils/03.common.html#showloading" class="sidebar-link">showLoading</a></li><li class="sidebar-sub-header"><a href="/saas-vuepress/指南/38.common-utils/03.common.html#showloading-2" class="sidebar-link">showLoading</a></li><li class="sidebar-sub-header"><a href="/saas-vuepress/指南/38.common-utils/03.common.html#hideloading" class="sidebar-link">hideLoading</a></li><li class="sidebar-sub-header"><a href="/saas-vuepress/指南/38.common-utils/03.common.html#showmodal" class="sidebar-link">showModal</a></li><li class="sidebar-sub-header"><a href="/saas-vuepress/指南/38.common-utils/03.common.html#iswechatbrowser" class="sidebar-link">isWechatBrowser</a></li><li class="sidebar-sub-header"><a href="/saas-vuepress/指南/38.common-utils/03.common.html#sessioncatch" class="sidebar-link">sessionCatch</a></li><li class="sidebar-sub-header"><a href="/saas-vuepress/指南/38.common-utils/03.common.html#jumppage" class="sidebar-link">jumpPage</a></li><li class="sidebar-sub-header"><a href="/saas-vuepress/指南/38.common-utils/03.common.html#jumppagedetail" class="sidebar-link">jumpPageDetail</a></li><li class="sidebar-sub-header"><a href="/saas-vuepress/指南/38.common-utils/03.common.html#backref" class="sidebar-link">backRef</a></li><li class="sidebar-sub-header"><a href="/saas-vuepress/指南/38.common-utils/03.common.html#backpage" class="sidebar-link">backPage</a></li><li class="sidebar-sub-header"><a href="/saas-vuepress/指南/38.common-utils/03.common.html#serverjump" class="sidebar-link">serverJump</a></li><li class="sidebar-sub-header"><a href="/saas-vuepress/指南/38.common-utils/03.common.html#data-letter-sort" class="sidebar-link">datalettersort</a></li></ul></li><li><a href="/saas-vuepress/指南/38.common-utils/04.countDown.html" class="sidebar-link">countDown</a></li><li><a href="/saas-vuepress/指南/38.common-utils/05.emitter.html" class="sidebar-link">emitter</a></li><li><a href="/saas-vuepress/指南/38.common-utils/06.global.html" class="sidebar-link">global</a></li><li><a href="/saas-vuepress/指南/38.common-utils/07.index.html" class="sidebar-link">index</a></li><li><a href="/saas-vuepress/指南/38.common-utils/08.pay.html" class="sidebar-link">pay</a></li><li><a href="/saas-vuepress/指南/38.common-utils/09.tool.html" class="sidebar-link">tool</a></li><li><a href="/saas-vuepress/指南/38.common-utils/10.validate.html" class="sidebar-link">validate</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>common-scss</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/39.common-scss/01.index.html" class="sidebar-link">index</a></li><li><a href="/saas-vuepress/指南/39.common-scss/02.theme.html" class="sidebar-link">theme</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>components</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/40.components/01.formBase.html" class="sidebar-link">formBase</a></li><li><a href="/saas-vuepress/指南/40.components/02.ss-share-wechat.html" class="sidebar-link">ss-share-wechat</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>goods目录</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/60.goods目录/01.collect商品收藏.html" class="sidebar-link">collect商品收藏</a></li><li><a href="/saas-vuepress/指南/60.goods目录/01.商品收藏.html" class="sidebar-link">商品收藏</a></li><li><a href="/saas-vuepress/指南/60.goods目录/03.details商品详情.html" class="sidebar-link">details商品详情</a></li><li><a href="/saas-vuepress/指南/60.goods目录/03.商品详情.html" class="sidebar-link">商品详情</a></li><li><a href="/saas-vuepress/指南/60.goods目录/04.group拼团.html" class="sidebar-link">group拼团</a></li><li><a href="/saas-vuepress/指南/60.goods目录/05.hot-selling精选好物.html" class="sidebar-link">hot-selling精选好物</a></li><li><a href="/saas-vuepress/指南/60.goods目录/06.logistics物流.html" class="sidebar-link">logistics物流</a></li><li><a href="/saas-vuepress/指南/60.goods目录/07.newGift新人专享福利.html" class="sidebar-link">newGift新人专享福利</a></li><li><a href="/saas-vuepress/指南/60.goods目录/08.order订单、拼团.html" class="sidebar-link">order订单、拼团</a></li><li><a href="/saas-vuepress/指南/60.goods目录/09.refuse售后.html" class="sidebar-link">refuse售后</a></li><li><a href="/saas-vuepress/指南/60.goods目录/10.search搜索.html" class="sidebar-link">search搜索</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>goods-components</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/61.goods-components/01.details-introduce.html" class="sidebar-link">details-introduce</a></li><li><a href="/saas-vuepress/指南/61.goods-components/02.details-tabs.html" class="sidebar-link">details-tabs</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>order订单</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/68.order订单/01.list订单列表.html" class="sidebar-link">list订单列表</a></li><li><a href="/saas-vuepress/指南/68.order订单/02.details商品详情.html" class="sidebar-link">details商品详情</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>refuse订单售后</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/69.refuse订单售后/01.list订单列表.html" class="sidebar-link">list订单列表</a></li><li><a href="/saas-vuepress/指南/69.refuse订单售后/02.details商品详情.html" class="sidebar-link">details商品详情</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>guest目录</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/70.guest目录/01.爆品视频模块.html" class="sidebar-link">爆品视频模块</a></li><li><a href="/saas-vuepress/指南/70.guest目录/02.工长模块.html" class="sidebar-link">工长模块</a></li><li><a href="/saas-vuepress/指南/70.guest目录/03.设计师模块.html" class="sidebar-link">设计师模块</a></li><li><a href="/saas-vuepress/指南/70.guest目录/04.优惠券模块.html" class="sidebar-link">优惠券模块</a></li><li><a href="/saas-vuepress/指南/70.guest目录/05.案例模块.html" class="sidebar-link">案例模块</a></li><li><a href="/saas-vuepress/指南/70.guest目录/06.攻略模块.html" class="sidebar-link">攻略模块</a></li><li><a href="/saas-vuepress/指南/70.guest目录/07.选择地址定位.html" class="sidebar-link">选择地址定位</a></li><li><a href="/saas-vuepress/指南/70.guest目录/08.套餐模块.html" class="sidebar-link">套餐模块</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>home-index-conmponents首页组件</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/80-1.home-index-conmponents首页组件/01.banner轮播图.html" class="sidebar-link">banner轮播图</a></li><li><a href="/saas-vuepress/指南/80-1.home-index-conmponents首页组件/02.card精选品牌.html" class="sidebar-link">card精选品牌</a></li><li><a href="/saas-vuepress/指南/80-1.home-index-conmponents首页组件/03.case-list装修案例.html" class="sidebar-link">case-list装修案例</a></li><li><a href="/saas-vuepress/指南/80-1.home-index-conmponents首页组件/04.classification品类分类.html" class="sidebar-link">classification品类分类</a></li><li><a href="/saas-vuepress/指南/80-1.home-index-conmponents首页组件/05.combo整装套餐.html" class="sidebar-link">combo整装套餐</a></li><li><a href="/saas-vuepress/指南/80-1.home-index-conmponents首页组件/06.couple新人礼.html" class="sidebar-link">couple新人礼</a></li><li><a href="/saas-vuepress/指南/80-1.home-index-conmponents首页组件/07.designer设计师.html" class="sidebar-link">designer设计师</a></li><li><a href="/saas-vuepress/指南/80-1.home-index-conmponents首页组件/08.features-bottom特色服务.html" class="sidebar-link">features-bottom特色服务</a></li><li><a href="/saas-vuepress/指南/80-1.home-index-conmponents首页组件/09.goodslist推荐商品.html" class="sidebar-link">goodslist推荐商品</a></li><li><a href="/saas-vuepress/指南/80-1.home-index-conmponents首页组件/11.matrixMenu子菜单.html" class="sidebar-link">matrixMenu子菜单</a></li><li><a href="/saas-vuepress/指南/80-1.home-index-conmponents首页组件/12.module-title更多.html" class="sidebar-link">module-title更多</a></li><li><a href="/saas-vuepress/指南/80-1.home-index-conmponents首页组件/13.slide-menu侧边按钮.html" class="sidebar-link">slide-menu侧边按钮</a></li><li><a href="/saas-vuepress/指南/80-1.home-index-conmponents首页组件/14.timeTabs限时秒杀.html" class="sidebar-link">timeTabs限时秒杀</a></li><li><a href="/saas-vuepress/指南/80-1.home-index-conmponents首页组件/15.topSearchAndTabs头部搜索.html" class="sidebar-link">topSearchAndTabs头部搜索</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>首页组件</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/80-1.首页组件/01.banner轮播图.html" class="sidebar-link">banner轮播图</a></li><li><a href="/saas-vuepress/指南/80-1.首页组件/02.card精选品牌.html" class="sidebar-link">card精选品牌</a></li><li><a href="/saas-vuepress/指南/80-1.首页组件/03.case-list装修案例.html" class="sidebar-link">case-list装修案例</a></li><li><a href="/saas-vuepress/指南/80-1.首页组件/04.classification品类分类.html" class="sidebar-link">classification品类分类</a></li><li><a href="/saas-vuepress/指南/80-1.首页组件/05.combo整装套餐.html" class="sidebar-link">combo整装套餐</a></li><li><a href="/saas-vuepress/指南/80-1.首页组件/06.couple新人礼.html" class="sidebar-link">couple新人礼</a></li><li><a href="/saas-vuepress/指南/80-1.首页组件/07.designer设计师.html" class="sidebar-link">designer设计师</a></li><li><a href="/saas-vuepress/指南/80-1.首页组件/08.features-bottom特色服务.html" class="sidebar-link">features-bottom特色服务</a></li><li><a href="/saas-vuepress/指南/80-1.首页组件/09.goodslist推荐商品.html" class="sidebar-link">goodslist推荐商品</a></li><li><a href="/saas-vuepress/指南/80-1.首页组件/11.matrixMenu子菜单.html" class="sidebar-link">matrixMenu子菜单</a></li><li><a href="/saas-vuepress/指南/80-1.首页组件/12.module-title更多.html" class="sidebar-link">module-title更多</a></li><li><a href="/saas-vuepress/指南/80-1.首页组件/12.module-title模块标题.html" class="sidebar-link">module-title模块标题</a></li><li><a href="/saas-vuepress/指南/80-1.首页组件/13.slide-menu侧边按钮.html" class="sidebar-link">slide-menu侧边按钮</a></li><li><a href="/saas-vuepress/指南/80-1.首页组件/14.timeTabs限时秒杀.html" class="sidebar-link">timeTabs限时秒杀</a></li><li><a href="/saas-vuepress/指南/80-1.首页组件/15.topSearchAndTabs头部搜索.html" class="sidebar-link">topSearchAndTabs头部搜索</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>home目录</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/saas-vuepress/指南/80.home目录/01.category商品分类.html" class="sidebar-link">category商品分类</a></li><li><a href="/saas-vuepress/指南/80.home目录/01.商品分类.html" class="sidebar-link">商品分类</a></li><li><a href="/saas-vuepress/指南/80.home目录/02.index首页.html" class="sidebar-link">index首页</a></li><li><a href="/saas-vuepress/指南/80.home目录/02.首页.html" class="sidebar-link">首页</a></li><li><a href="/saas-vuepress/指南/80.home目录/03.login登录.html" class="sidebar-link">login登录</a></li><li><a href="/saas-vuepress/指南/80.home目录/03.登录.html" class="sidebar-link">登录</a></li><li><a href="/saas-vuepress/指南/80.home目录/04.shopping-cart购物车.html" class="sidebar-link">shopping-cart购物车</a></li><li><a href="/saas-vuepress/指南/80.home目录/04.购物车.html" class="sidebar-link">购物车</a></li><li><a href="/saas-vuepress/指南/80.home目录/05.user我的.html" class="sidebar-link">user我的</a></li><li><a href="/saas-vuepress/指南/80.home目录/05.我的.html" class="sidebar-link">我的</a></li></ul></section></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h1 id="common"><a href="#common" class="header-anchor">#</a> Common</h1> <h2 id="引用"><a href="#引用" class="header-anchor">#</a> 引用</h2> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">import</span> Vue <span class="token keyword">from</span> <span class="token string">'vue'</span>
<span class="token keyword">import</span> Router <span class="token keyword">from</span> <span class="token string">'@/common/router'</span>
<span class="token keyword">import</span> <span class="token punctuation">{</span> getVariableType<span class="token punctuation">,</span> isEmpty<span class="token punctuation">,</span> deepClone <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'@/common/utils/tools'</span>
</code></pre></div><h2 id="showtoast"><a href="#showtoast" class="header-anchor">#</a> showToast</h2> <p>消息提示框</p> <table><thead><tr><th>属性名</th> <th>说明</th> <th>类型</th> <th>是否必填</th> <th>默认值</th> <th>可选值</th></tr></thead> <tbody><tr><td>title</td> <td>提示的内容，长度与 icon 取值有关。</td> <td>是</td> <td>String</td> <td>-</td> <td></td></tr> <tr><td>icon</td> <td>图标</td> <td>String</td> <td>否</td> <td>-</td> <td>success/loading/none</td></tr> <tr><td>duration</td> <td>提示的延迟时间，单位毫秒</td> <td>Number</td> <td>否</td> <td>1500</td> <td></td></tr> <tr><td>image</td> <td>自定义图标的本地路径</td> <td>String</td> <td>否</td> <td>-</td> <td></td></tr> <tr><td>mask</td> <td>是否显示透明蒙层，防止触摸穿透</td> <td>Boolean</td> <td>否</td> <td>false</td> <td></td></tr></tbody></table> <div class="language-js extra-class"><pre class="language-js"><code><span class="token comment">//使用方法</span>
<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$toast</span><span class="token punctuation">(</span><span class="token string">'格式错误'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

<span class="token comment">//方法</span>
<span class="token keyword">export</span> <span class="token keyword">function</span> <span class="token function">showToast</span><span class="token punctuation">(</span><span class="token parameter">msg<span class="token punctuation">,</span> icon <span class="token operator">=</span> <span class="token number">0</span><span class="token punctuation">,</span> duration <span class="token operator">=</span> <span class="token number">1500</span><span class="token punctuation">,</span> mask <span class="token operator">=</span> <span class="token boolean">true</span><span class="token punctuation">,</span> image <span class="token operator">=</span> <span class="token boolean">false</span></span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
    <span class="token keyword">const</span> icons <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token string">'none'</span><span class="token punctuation">,</span> <span class="token string">'success'</span><span class="token punctuation">,</span> <span class="token string">'loading'</span><span class="token punctuation">]</span>
    <span class="token keyword">const</span> _icon <span class="token operator">=</span> icons<span class="token punctuation">[</span>icon<span class="token punctuation">]</span><span class="token punctuation">;</span>
    <span class="token keyword">let</span> params <span class="token operator">=</span> <span class="token punctuation">{</span>
        icon<span class="token operator">:</span> _icon<span class="token punctuation">,</span>
        title<span class="token operator">:</span> msg <span class="token operator">||</span> <span class="token string">'系统繁忙'</span><span class="token punctuation">,</span>
        duration<span class="token operator">:</span> duration<span class="token punctuation">,</span>
        mask<span class="token operator">:</span> mask
    <span class="token punctuation">}</span>
    image <span class="token operator">&amp;&amp;</span> <span class="token punctuation">(</span>params<span class="token punctuation">.</span>image <span class="token operator">=</span> image<span class="token punctuation">)</span><span class="token punctuation">;</span>
    uni<span class="token punctuation">.</span><span class="token function">showToast</span><span class="token punctuation">(</span>params<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>

<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    $toast<span class="token operator">:</span> showToast
<span class="token punctuation">}</span>
</code></pre></div><h2 id="showloading"><a href="#showloading" class="header-anchor">#</a> showLoading</h2> <p>loading框</p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token comment">//使用方法</span>
<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$loading</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$loading</span><span class="token punctuation">(</span><span class="token string">'正在购物车'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

<span class="token comment">//方法</span>
<span class="token keyword">export</span> <span class="token keyword">function</span> <span class="token function">showLoading</span><span class="token punctuation">(</span>msg <span class="token operator">=</span> <span class="token string">'加载中'</span><span class="token punctuation">,</span> mask <span class="token operator">=</span> <span class="token boolean">true</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
    <span class="token keyword">let</span> params <span class="token operator">=</span> <span class="token punctuation">{</span>
        mask<span class="token operator">:</span> mask<span class="token punctuation">,</span>
        title<span class="token operator">:</span> msg
    <span class="token punctuation">}</span>
    uni<span class="token punctuation">.</span><span class="token function">showLoading</span><span class="token punctuation">(</span>params<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>

<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    $loading<span class="token operator">:</span> showLoading
<span class="token punctuation">}</span>
</code></pre></div><h2 id="showloading-2"><a href="#showloading-2" class="header-anchor">#</a> showLoading</h2> <p>loading框</p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token comment">//使用方法</span>
<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$loading</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$loading</span><span class="token punctuation">(</span><span class="token string">'正在购物车'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

<span class="token comment">//方法</span>
<span class="token keyword">export</span> <span class="token keyword">function</span> <span class="token function">showLoading</span><span class="token punctuation">(</span>msg <span class="token operator">=</span> <span class="token string">'加载中'</span><span class="token punctuation">,</span> mask <span class="token operator">=</span> <span class="token boolean">true</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
    <span class="token keyword">let</span> params <span class="token operator">=</span> <span class="token punctuation">{</span>
        mask<span class="token operator">:</span> mask<span class="token punctuation">,</span>
        title<span class="token operator">:</span> msg
    <span class="token punctuation">}</span>
    uni<span class="token punctuation">.</span><span class="token function">showLoading</span><span class="token punctuation">(</span>params<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>

<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    $loading<span class="token operator">:</span> showLoading
<span class="token punctuation">}</span>
</code></pre></div><h2 id="hideloading"><a href="#hideloading" class="header-anchor">#</a> hideLoading</h2> <p>隐藏loading框</p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token comment">//使用方法</span>
<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$hideLoading</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

<span class="token comment">//方法</span>
<span class="token keyword">export</span> <span class="token keyword">function</span> <span class="token function">hideLoading</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
    uni<span class="token punctuation">.</span><span class="token function">hideLoading</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>

<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    $hideLoading<span class="token operator">:</span> hideLoading
<span class="token punctuation">}</span>
</code></pre></div><h2 id="showmodal"><a href="#showmodal" class="header-anchor">#</a> showModal</h2> <p>显示对话框</p> <table><thead><tr><th>属性名</th> <th>说明</th> <th>类型</th> <th>是否必填</th> <th>默认值</th> <th>可选值</th></tr></thead> <tbody><tr><td>title</td> <td>提示的标题</td> <td>String</td> <td>是</td> <td>-</td> <td>-</td></tr> <tr><td>content</td> <td>提示的内容</td> <td>String</td> <td>是</td> <td>-</td> <td>-</td></tr> <tr><td>showCancel</td> <td>是否显示取消按钮</td> <td>Boolean</td> <td>否</td> <td>true</td> <td>false</td></tr> <tr><td>cancelText</td> <td>取消按钮的文字，最多4个字符</td> <td>String</td> <td>否</td> <td>取消</td> <td>-</td></tr> <tr><td>cancelColor</td> <td>取消按钮的文字颜色，H5、微信小程序、百度小程序</td> <td>HexColor</td> <td>否</td> <td>#000000</td> <td>-</td></tr> <tr><td>confirmText</td> <td>确定按钮的文字，最多 4 个字符</td> <td>String</td> <td>否</td> <td>确定</td> <td>-</td></tr> <tr><td>confirmColor</td> <td>确定按钮的文字颜色，H5、微信小程序、百度小程序</td> <td>HexColor</td> <td>否</td> <td>H5平台默认为&quot;#007aff&quot;，微信小程序平台默认为&quot;#3CC51F&quot;，百度小程序平台默认为&quot;#3c76ff&quot;</td> <td>-</td></tr> <tr><td>success</td> <td>接口调用成功的回调函数</td> <td>Function</td> <td>否</td> <td>-</td> <td></td></tr> <tr><td>fail</td> <td>接口调用失败的回调函数</td> <td>Function</td> <td>否</td> <td>-</td> <td></td></tr> <tr><td>complete</td> <td>接口调用结束的回调函数（调用成功、失败都会执行）</td> <td>Function</td> <td>否</td> <td>-</td> <td></td></tr></tbody></table> <div class="language-js extra-class"><pre class="language-js"><code><span class="token comment">//使用方法</span>
<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$modal</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
	title<span class="token operator">:</span> <span class="token string">'温馨提示'</span><span class="token punctuation">,</span>
	content<span class="token operator">:</span> <span class="token string">'您确定要退出登录？'</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span>

<span class="token comment">//方法</span>
<span class="token keyword">export</span> <span class="token keyword">function</span> <span class="token function">showModal</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
    title <span class="token operator">=</span> <span class="token string">''</span><span class="token punctuation">,</span>
    content <span class="token operator">=</span> <span class="token string">'这是一个模态框'</span><span class="token punctuation">,</span>
    showCancel <span class="token operator">=</span> <span class="token boolean">true</span><span class="token punctuation">,</span>
    cancelText <span class="token operator">=</span> <span class="token string">'取消'</span><span class="token punctuation">,</span>
    cancelColor <span class="token operator">=</span> <span class="token string">'#666'</span><span class="token punctuation">,</span>
    confirmText <span class="token operator">=</span> <span class="token string">'确定'</span><span class="token punctuation">,</span>
    confirmColor <span class="token operator">=</span> <span class="token string">'#0260fe'</span><span class="token punctuation">,</span>
    success<span class="token punctuation">,</span>
    fail<span class="token punctuation">,</span>
    complete
<span class="token punctuation">}</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
    uni<span class="token punctuation">.</span><span class="token function">showModal</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
        title<span class="token operator">:</span> title<span class="token punctuation">,</span>
        content<span class="token operator">:</span> content<span class="token punctuation">,</span>
        showCancel<span class="token operator">:</span> showCancel<span class="token punctuation">,</span>
        cancelText<span class="token operator">:</span> cancelText<span class="token punctuation">,</span>
        cancelColor<span class="token operator">:</span> cancelColor<span class="token punctuation">,</span>
        confirmText<span class="token operator">:</span> confirmText<span class="token punctuation">,</span>
        confirmColor<span class="token operator">:</span> confirmColor<span class="token punctuation">,</span>
        <span class="token function-variable function">success</span><span class="token operator">:</span> <span class="token punctuation">(</span><span class="token parameter">res</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
            success <span class="token operator">&amp;&amp;</span> <span class="token function">success</span><span class="token punctuation">(</span>res<span class="token punctuation">)</span><span class="token punctuation">;</span>
        <span class="token punctuation">}</span><span class="token punctuation">,</span>
        <span class="token function-variable function">fail</span><span class="token operator">:</span> <span class="token punctuation">(</span><span class="token parameter">err</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
            fail <span class="token operator">&amp;&amp;</span> <span class="token function">fail</span><span class="token punctuation">(</span>err<span class="token punctuation">)</span><span class="token punctuation">;</span>
        <span class="token punctuation">}</span><span class="token punctuation">,</span>
        <span class="token function-variable function">complete</span><span class="token operator">:</span> <span class="token punctuation">(</span><span class="token parameter">res</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
            complete <span class="token operator">&amp;&amp;</span> <span class="token function">complete</span><span class="token punctuation">(</span>res<span class="token punctuation">)</span><span class="token punctuation">;</span>
        <span class="token punctuation">}</span>
    <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>

<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    $modal<span class="token operator">:</span> showModal<span class="token punctuation">,</span>
<span class="token punctuation">}</span>
</code></pre></div><h2 id="iswechatbrowser"><a href="#iswechatbrowser" class="header-anchor">#</a> isWechatBrowser</h2> <p>判断微信浏览器还是h5</p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token comment">//使用方法</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$isWechatBrowser

<span class="token comment">//方法</span>
<span class="token keyword">export</span> <span class="token keyword">const</span> isWechatBrowser <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
    <span class="token comment">// #ifdef H5</span>
    <span class="token keyword">let</span> ua <span class="token operator">=</span> navigator<span class="token punctuation">.</span>userAgent<span class="token punctuation">.</span><span class="token function">toLowerCase</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token keyword">return</span> <span class="token punctuation">(</span><span class="token regex"><span class="token regex-delimiter">/</span><span class="token regex-source language-regex">micromessenger</span><span class="token regex-delimiter">/</span></span><span class="token punctuation">.</span><span class="token function">test</span><span class="token punctuation">(</span>ua<span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token operator">?</span> <span class="token boolean">true</span> <span class="token operator">:</span> <span class="token boolean">false</span><span class="token punctuation">;</span>
    <span class="token comment">// #endif</span>
    <span class="token keyword">return</span> <span class="token boolean">false</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    $isWechatBrowser<span class="token operator">:</span> isWechatBrowser<span class="token punctuation">,</span>
<span class="token punctuation">}</span>
</code></pre></div><h2 id="sessioncatch"><a href="#sessioncatch" class="header-anchor">#</a> sessionCatch</h2> <p>缓存</p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token comment">//使用方法</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$session<span class="token punctuation">.</span><span class="token function">set</span><span class="token punctuation">(</span>key<span class="token punctuation">,</span> val<span class="token punctuation">)</span><span class="token punctuation">;</span>  <span class="token comment">//设置</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$session<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span>key<span class="token punctuation">)</span><span class="token punctuation">;</span>  <span class="token comment">//取值</span>

<span class="token comment">//方法</span>
<span class="token keyword">export</span> <span class="token keyword">const</span> sessionCatch <span class="token operator">=</span> <span class="token punctuation">{</span>
    <span class="token comment">// #ifdef H5</span>
    <span class="token function">set</span><span class="token punctuation">(</span>key<span class="token punctuation">,</span> val<span class="token punctuation">)</span> <span class="token punctuation">{</span>
        <span class="token keyword">let</span> sessionKey <span class="token operator">=</span> key <span class="token operator">+</span> <span class="token string">'Session'</span><span class="token punctuation">;</span>
        <span class="token keyword">let</span> type <span class="token operator">=</span> <span class="token keyword">typeof</span> val<span class="token punctuation">;</span>
        sessionStorage<span class="token punctuation">.</span><span class="token function">setItem</span><span class="token punctuation">(</span>sessionKey<span class="token punctuation">,</span> <span class="token constant">JSON</span><span class="token punctuation">.</span><span class="token function">stringify</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
            type<span class="token operator">:</span> type<span class="token punctuation">,</span>
            data<span class="token operator">:</span> val
        <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token punctuation">}</span><span class="token punctuation">,</span>
    <span class="token function">get</span><span class="token punctuation">(</span>key<span class="token punctuation">)</span> <span class="token punctuation">{</span>
        <span class="token keyword">let</span> sessionKey <span class="token operator">=</span> key <span class="token operator">+</span> <span class="token string">'Session'</span><span class="token punctuation">;</span>
        <span class="token keyword">let</span> data <span class="token operator">=</span> <span class="token constant">JSON</span><span class="token punctuation">.</span><span class="token function">parse</span><span class="token punctuation">(</span>sessionStorage<span class="token punctuation">.</span><span class="token function">getItem</span><span class="token punctuation">(</span>sessionKey<span class="token punctuation">)</span> <span class="token operator">||</span> <span class="token string">'{}'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
        <span class="token keyword">return</span> data<span class="token punctuation">.</span>data<span class="token punctuation">;</span>
    <span class="token punctuation">}</span><span class="token punctuation">,</span>
    <span class="token function">remove</span><span class="token punctuation">(</span><span class="token parameter">key</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
        <span class="token keyword">let</span> sessionKey <span class="token operator">=</span> key <span class="token operator">+</span> <span class="token string">'Session'</span><span class="token punctuation">;</span>
        sessionStorage<span class="token punctuation">.</span><span class="token function">removeItem</span><span class="token punctuation">(</span>sessionKey<span class="token punctuation">)</span>
    <span class="token punctuation">}</span><span class="token punctuation">,</span>
    <span class="token function">clear</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
        sessionStorage<span class="token punctuation">.</span><span class="token function">clear</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token punctuation">}</span><span class="token punctuation">,</span>
    <span class="token comment">// #endif</span>
    <span class="token comment">// #ifndef H5</span>
    <span class="token function">set</span><span class="token punctuation">(</span>key<span class="token punctuation">,</span> val<span class="token punctuation">)</span> <span class="token punctuation">{</span>
        <span class="token keyword">let</span> sessionKey <span class="token operator">=</span> key <span class="token operator">+</span> <span class="token string">'Session'</span><span class="token punctuation">;</span>
        uni<span class="token punctuation">.</span><span class="token function">setStorageSync</span><span class="token punctuation">(</span>sessionKey<span class="token punctuation">,</span> val<span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token punctuation">}</span><span class="token punctuation">,</span>
    <span class="token function">get</span><span class="token punctuation">(</span>key<span class="token punctuation">)</span> <span class="token punctuation">{</span>
        <span class="token keyword">let</span> sessionKey <span class="token operator">=</span> key <span class="token operator">+</span> <span class="token string">'Session'</span><span class="token punctuation">;</span>
        <span class="token keyword">return</span> uni<span class="token punctuation">.</span><span class="token function">getStorageSync</span><span class="token punctuation">(</span>sessionKey<span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token punctuation">}</span><span class="token punctuation">,</span>
    <span class="token function">remove</span><span class="token punctuation">(</span><span class="token parameter">key</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
        <span class="token keyword">let</span> sessionKey <span class="token operator">=</span> key <span class="token operator">+</span> <span class="token string">'Session'</span><span class="token punctuation">;</span>
        uni<span class="token punctuation">.</span><span class="token function">removeStorageSync</span><span class="token punctuation">(</span>sessionKey<span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token punctuation">}</span><span class="token punctuation">,</span>
    <span class="token function">clear</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
        <span class="token keyword">let</span> allSession <span class="token operator">=</span> uni<span class="token punctuation">.</span><span class="token function">getStorageInfoSync</span><span class="token punctuation">(</span><span class="token string">'uni-storage-keys'</span><span class="token punctuation">)</span><span class="token punctuation">.</span>keys<span class="token punctuation">;</span>
        allSession<span class="token punctuation">.</span><span class="token function">forEach</span><span class="token punctuation">(</span><span class="token parameter">key</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
            <span class="token keyword">if</span> <span class="token punctuation">(</span>key<span class="token punctuation">.</span><span class="token function">indexOf</span><span class="token punctuation">(</span><span class="token string">'Session'</span><span class="token punctuation">)</span> <span class="token operator">!==</span> <span class="token operator">-</span><span class="token number">1</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
                uni<span class="token punctuation">.</span><span class="token function">removeStorageSync</span><span class="token punctuation">(</span>key<span class="token punctuation">)</span><span class="token punctuation">;</span>
            <span class="token punctuation">}</span>
        <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token punctuation">}</span>
    <span class="token comment">// #endif</span>
<span class="token punctuation">}</span>

<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
     $session<span class="token operator">:</span> sessionCatch
<span class="token punctuation">}</span>
</code></pre></div><h2 id="jumppage"><a href="#jumppage" class="header-anchor">#</a> jumpPage</h2> <p>跳转函数</p> <table><thead><tr><th>属性名</th> <th>说明</th> <th>类型</th> <th>是否必填</th> <th>默认值</th> <th>可选值</th></tr></thead> <tbody><tr><td>name</td> <td>路由名称或者页面路径 用/开头</td> <td>String</td> <td>是</td> <td>-</td> <td>-</td></tr> <tr><td>params</td> <td>跳转参数</td> <td>object,null</td> <td>否</td> <td>-</td> <td>-</td></tr> <tr><td>method</td> <td>跳转方法</td> <td>String</td> <td>否</td> <td>-</td> <td>-</td></tr> <tr><td>errFn</td> <td>路由错误回调</td> <td>function,null</td> <td>否</td> <td>-</td> <td>-</td></tr></tbody></table> <div class="language-js extra-class"><pre class="language-js"><code><span class="token comment">//使用方法（跳转商品详情为例，商品详情的路由名称为goodsDetails）</span>
跳转后地址 <span class="token operator">/</span>goods<span class="token operator">/</span>details<span class="token operator">/</span>index<span class="token operator">?</span>detailId<span class="token operator">=</span><span class="token number">118</span><span class="token operator">&amp;</span>extraData<span class="token operator">=</span><span class="token number">1111</span>
方式<span class="token number">1</span>：<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$jump</span><span class="token punctuation">(</span><span class="token string">'/goods/details/index?detailId=118&amp;extraData=1111'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
方式<span class="token number">2</span>：<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$jump</span><span class="token punctuation">(</span><span class="token string">'goodsDetails'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span>detailId<span class="token operator">:</span> <span class="token number">118</span><span class="token punctuation">,</span> extraData<span class="token operator">:</span> <span class="token number">1111</span><span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
方式<span class="token number">3</span>（推荐）：<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$jumpDetail</span><span class="token punctuation">(</span><span class="token string">'goodsDetails'</span><span class="token punctuation">,</span> <span class="token number">501</span><span class="token punctuation">,</span> <span class="token punctuation">{</span>extraData<span class="token operator">:</span> <span class="token number">1111</span><span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
tip：建议跳转详情相关的全部使用<span class="token keyword">this</span><span class="token punctuation">.</span>$jumpDetail，该跳转方式规范了id参数名称，方便项目维护和后期添加需求时快速应对

<span class="token comment">//方法</span>
<span class="token keyword">export</span> <span class="token keyword">const</span> jumpPage <span class="token operator">=</span> <span class="token punctuation">(</span>name<span class="token punctuation">,</span> params <span class="token operator">=</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">,</span> method <span class="token operator">=</span> <span class="token string">'push'</span><span class="token punctuation">,</span> errFn<span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
    <span class="token keyword">if</span><span class="token punctuation">(</span><span class="token operator">!</span>name<span class="token punctuation">)</span> <span class="token keyword">return</span> <span class="token punctuation">;</span>
	params <span class="token operator">=</span> params <span class="token operator">?</span> params <span class="token operator">:</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">;</span>
	<span class="token keyword">if</span><span class="token punctuation">(</span>name<span class="token punctuation">.</span><span class="token function">indexOf</span><span class="token punctuation">(</span><span class="token string">'?'</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
		<span class="token keyword">let</span> routeObj <span class="token operator">=</span> <span class="token function">getUrlQuery</span><span class="token punctuation">(</span>name<span class="token punctuation">)</span><span class="token punctuation">;</span>
		name <span class="token operator">=</span> routeObj<span class="token punctuation">.</span>path<span class="token punctuation">;</span>
		params <span class="token operator">=</span> Object<span class="token punctuation">.</span><span class="token function">assign</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">,</span> params<span class="token punctuation">,</span> routeObj<span class="token punctuation">.</span>query<span class="token punctuation">)</span><span class="token punctuation">;</span>
	<span class="token punctuation">}</span>
	<span class="token keyword">let</span> jumpRouteObj <span class="token operator">=</span> <span class="token constant">ROUTES</span><span class="token punctuation">.</span><span class="token function">find</span><span class="token punctuation">(</span><span class="token parameter">o</span> <span class="token operator">=&gt;</span> o<span class="token punctuation">.</span>name <span class="token operator">===</span> name <span class="token operator">||</span> o<span class="token punctuation">.</span>path <span class="token operator">===</span> name <span class="token operator">||</span> o<span class="token punctuation">.</span>aliasPath <span class="token operator">===</span> name<span class="token punctuation">)</span><span class="token punctuation">;</span>
	<span class="token keyword">if</span><span class="token punctuation">(</span><span class="token operator">!</span>jumpRouteObj<span class="token punctuation">)</span><span class="token punctuation">{</span>
		errFn <span class="token operator">&amp;&amp;</span> <span class="token function">errFn</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
		<span class="token keyword">return</span> console<span class="token punctuation">.</span><span class="token function">error</span><span class="token punctuation">(</span><span class="token string">'[fatal error] 路由地址错误，『'</span> <span class="token operator">+</span> name <span class="token operator">+</span> <span class="token string">'』不存在路由表中'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
	<span class="token punctuation">}</span>
    params <span class="token operator">=</span> <span class="token function">formatParams</span><span class="token punctuation">(</span>params<span class="token punctuation">)</span> <span class="token operator">||</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">;</span>
    Router<span class="token punctuation">[</span>method<span class="token punctuation">]</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
        name<span class="token operator">:</span> jumpRouteObj<span class="token punctuation">.</span>name<span class="token punctuation">,</span>
        params<span class="token operator">:</span> params
    <span class="token punctuation">}</span><span class="token punctuation">)</span>
<span class="token punctuation">}</span>

<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    $jump<span class="token operator">:</span> jumpPage
<span class="token punctuation">}</span>
</code></pre></div><h2 id="jumppagedetail"><a href="#jumppagedetail" class="header-anchor">#</a> jumpPageDetail</h2> <p>跳转详情</p> <table><thead><tr><th>属性名</th> <th>说明</th> <th>类型</th> <th>是否必填</th> <th>默认值</th> <th>可选值</th></tr></thead> <tbody><tr><td>name</td> <td>路由名称或者页面路径 用/开头</td> <td>String</td> <td>是</td> <td>-</td> <td>-</td></tr> <tr><td>id</td> <td>详情页id</td> <td>String/Number</td> <td>是</td> <td>-</td> <td>-</td></tr> <tr><td>params</td> <td>跳转参数</td> <td>object,null</td> <td>否</td> <td>-</td> <td>-</td></tr> <tr><td>method</td> <td>跳转方法</td> <td>String</td> <td>否</td> <td>-</td> <td>push、replace、replaceAll、pushTab（我们项目用不到）</td></tr></tbody></table> <div class="language-js extra-class"><pre class="language-js"><code><span class="token comment">//使用方法</span>
<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$jumpDetail</span><span class="token punctuation">(</span><span class="token string">'refuseDetails'</span><span class="token punctuation">,</span> <span class="token number">111</span> <span class="token punctuation">,</span> <span class="token punctuation">{</span> isPush<span class="token operator">:</span> <span class="token boolean">true</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token string">'replace'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> 

<span class="token comment">//方法</span>
<span class="token keyword">export</span> <span class="token keyword">const</span> jumpPageDetail <span class="token operator">=</span> <span class="token punctuation">(</span>name<span class="token punctuation">,</span> id<span class="token punctuation">,</span> params <span class="token operator">=</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">,</span> method <span class="token operator">=</span> <span class="token string">'push'</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
	params <span class="token operator">=</span> params <span class="token operator">?</span> params <span class="token operator">:</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">;</span> 
	params<span class="token punctuation">.</span>detailId <span class="token operator">=</span> id<span class="token punctuation">;</span>
    params <span class="token operator">=</span> <span class="token function">formatParams</span><span class="token punctuation">(</span>params<span class="token punctuation">)</span> <span class="token operator">||</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">;</span>
    <span class="token keyword">if</span><span class="token punctuation">(</span><span class="token operator">!</span>name<span class="token punctuation">)</span> <span class="token keyword">return</span> <span class="token punctuation">;</span>
    <span class="token keyword">return</span> <span class="token function">jumpPage</span><span class="token punctuation">(</span>name<span class="token punctuation">,</span> params<span class="token punctuation">,</span> method<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>

<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    $jumpDetail<span class="token operator">:</span> jumpPageDetail<span class="token punctuation">,</span>
<span class="token punctuation">}</span>
</code></pre></div><h2 id="backref"><a href="#backref" class="header-anchor">#</a> backRef</h2> <p>返回上一页</p> <table><thead><tr><th>属性名</th> <th>说明</th> <th>类型</th> <th>是否必填</th> <th>默认值</th> <th>可选值</th></tr></thead> <tbody><tr><td>params</td> <td>要修改或者向上一页传递的值</td> <td>Object, null</td> <td>否</td> <td>-</td> <td>-</td></tr> <tr><td>extraQuery</td> <td>上一页的值，不参数参数传递</td> <td>Object, null</td> <td>否</td> <td>-</td> <td>-</td></tr> <tr><td>replace</td> <td>是否强制替掉所有页面（主要用于解决强登录带来的bug）</td> <td>object,null</td> <td>否</td> <td>-</td> <td>-</td></tr></tbody></table> <div class="language-js extra-class"><pre class="language-js"><code><span class="token comment">//使用方法</span>
<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$backRef</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> 

<span class="token comment">//方法</span>
<span class="token keyword">export</span> <span class="token keyword">const</span> <span class="token function-variable function">backRef</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter">params <span class="token operator">=</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">,</span> extraQuery <span class="token operator">=</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">,</span> replace <span class="token operator">=</span> <span class="token boolean">false</span></span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
	params <span class="token operator">=</span> params <span class="token operator">?</span> params <span class="token operator">:</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">;</span> 
	extraQuery <span class="token operator">=</span> extraQuery <span class="token operator">?</span> extraQuery <span class="token operator">:</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">;</span>
    <span class="token keyword">let</span> that_ <span class="token operator">=</span> <span class="token class-name">Vue</span><span class="token punctuation">.</span>prototype<span class="token punctuation">;</span>
    <span class="token comment">//小程序端有问题，所以需要加$nextTick</span>
    that_<span class="token punctuation">.</span><span class="token function">$nextTick</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
        <span class="token keyword">let</span> query <span class="token operator">=</span> Object<span class="token punctuation">.</span><span class="token function">assign</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">,</span> that_<span class="token punctuation">.</span>$Route<span class="token punctuation">.</span>query<span class="token punctuation">,</span> extraQuery<span class="token punctuation">)</span><span class="token punctuation">;</span>
        <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span>query<span class="token punctuation">.</span>lastName<span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">//没有上一页指定则正常返回</span>
            <span class="token keyword">return</span> <span class="token function">backPage</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
        <span class="token punctuation">}</span>
        <span class="token keyword">let</span> pages <span class="token operator">=</span> <span class="token function">getCurrentPages</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">//全部页面</span>
        <span class="token keyword">let</span> prevPage <span class="token operator">=</span> pages<span class="token punctuation">[</span>pages<span class="token punctuation">.</span>length <span class="token operator">-</span> <span class="token number">2</span><span class="token punctuation">]</span><span class="token punctuation">;</span> <span class="token comment">//上一个页面</span>
        <span class="token keyword">let</span> lastQuery <span class="token operator">=</span> <span class="token constant">JSON</span><span class="token punctuation">.</span><span class="token function">parse</span><span class="token punctuation">(</span>query<span class="token punctuation">.</span>lastQuery <span class="token operator">||</span> <span class="token string">'{}'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
        <span class="token keyword">let</span> isExitQuery <span class="token operator">=</span> <span class="token boolean">false</span><span class="token punctuation">;</span>
        <span class="token keyword">if</span> <span class="token punctuation">(</span>replace <span class="token operator">||</span> isExitQuery <span class="token operator">||</span> pages<span class="token punctuation">.</span>length <span class="token operator">===</span> <span class="token number">1</span> <span class="token operator">||</span> <span class="token punctuation">(</span><span class="token string">'/'</span> <span class="token operator">+</span> prevPage<span class="token punctuation">.</span>route<span class="token punctuation">)</span> <span class="token operator">!==</span> <span class="token function">decodeURIComponent</span><span class="token punctuation">(</span>query<span class="token punctuation">.</span>prevPath<span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
			<span class="token function">jumpPage</span><span class="token punctuation">(</span>query<span class="token punctuation">.</span>lastName<span class="token punctuation">,</span> Object<span class="token punctuation">.</span><span class="token function">assign</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">,</span> lastQuery<span class="token punctuation">,</span> params<span class="token punctuation">)</span><span class="token punctuation">,</span> replace <span class="token operator">?</span> <span class="token string">'replaceAll'</span> <span class="token operator">:</span> <span class="token string">'replace'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
        <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span>
            Object<span class="token punctuation">.</span><span class="token function">keys</span><span class="token punctuation">(</span>params<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">forEach</span><span class="token punctuation">(</span><span class="token parameter">key</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
                prevPage<span class="token punctuation">.</span>$vm<span class="token punctuation">[</span>key<span class="token punctuation">]</span> <span class="token operator">=</span> params<span class="token punctuation">[</span>key<span class="token punctuation">]</span><span class="token punctuation">;</span>
            <span class="token punctuation">}</span><span class="token punctuation">)</span>
            <span class="token function">backPage</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
        <span class="token punctuation">}</span>
    <span class="token punctuation">}</span><span class="token punctuation">)</span>
<span class="token punctuation">}</span>

<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    $backRef<span class="token operator">:</span> backRef<span class="token punctuation">,</span>
<span class="token punctuation">}</span>
</code></pre></div><h2 id="backpage"><a href="#backpage" class="header-anchor">#</a> backPage</h2> <p>返回上一页</p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token comment">//使用方法</span>
<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$back</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> 

<span class="token comment">//方法</span>
<span class="token keyword">export</span> <span class="token keyword">const</span> <span class="token function-variable function">backPage</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
    <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token function">getCurrentPages</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span>length <span class="token operator">===</span> <span class="token number">1</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
		<span class="token function">jumpPage</span><span class="token punctuation">(</span><span class="token string">'home'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token string">'replace'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span>
        Router<span class="token punctuation">.</span><span class="token function">back</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token punctuation">}</span>
<span class="token punctuation">}</span>

<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
   $back<span class="token operator">:</span> backPage<span class="token punctuation">,</span>
<span class="token punctuation">}</span>
</code></pre></div><h2 id="serverjump"><a href="#serverjump" class="header-anchor">#</a> serverJump</h2> <p>专题页跳转以及后端配置地址跳转</p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token comment">//使用方法</span>
<span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$serverJump</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
	app_page<span class="token operator">:</span> <span class="token string">'https://www.baidu.com/'</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

<span class="token comment">//方法</span>
<span class="token keyword">export</span> <span class="token keyword">const</span> <span class="token function-variable function">serverJump</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter"><span class="token punctuation">{</span>
		app_page<span class="token punctuation">,</span>
		id<span class="token punctuation">,</span>
		keyword<span class="token punctuation">,</span>
		cat_id
	<span class="token punctuation">}</span></span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
	<span class="token keyword">if</span><span class="token punctuation">(</span><span class="token operator">!</span>app_page<span class="token punctuation">)</span> <span class="token keyword">return</span> <span class="token punctuation">;</span>
	<span class="token keyword">if</span><span class="token punctuation">(</span><span class="token regex"><span class="token regex-delimiter">/</span><span class="token regex-source language-regex">(http:\/\/|https:\/\/)((\w|=|\?|\.|\/|&amp;|-)+)</span><span class="token regex-delimiter">/</span><span class="token regex-flags">g</span></span><span class="token punctuation">.</span><span class="token function">test</span><span class="token punctuation">(</span>app_page<span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">{</span><span class="token comment">//远端地址</span>
		<span class="token function">jumpPage</span><span class="token punctuation">(</span><span class="token string">'webView'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span>
			url<span class="token operator">:</span> app_page
		<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
	<span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token keyword">if</span> <span class="token punctuation">(</span>cat_id <span class="token operator">||</span> keyword<span class="token punctuation">)</span> <span class="token punctuation">{</span>
		<span class="token function">jumpPage</span><span class="token punctuation">(</span>app_page<span class="token punctuation">,</span> <span class="token punctuation">{</span>
			cat_id<span class="token punctuation">,</span>
			keyword
		<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
	<span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span>
		<span class="token function">jumpPageDetail</span><span class="token punctuation">(</span>app_page<span class="token punctuation">,</span> id<span class="token punctuation">)</span><span class="token punctuation">;</span>
	<span class="token punctuation">}</span>
<span class="token punctuation">}</span>

<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
   $serverJump<span class="token operator">:</span> serverJump
<span class="token punctuation">}</span>
</code></pre></div><h2 id="data-letter-sort"><a href="#data-letter-sort" class="header-anchor">#</a> data_letter_sort</h2> <p>数据 按照拼音首字母 排序 并分组</p> <div class="language-js extra-class"><pre class="language-js"><code>
<span class="token comment">//方法</span>
<span class="token keyword">const</span> <span class="token function-variable function">data_letter_sort</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter">data<span class="token punctuation">,</span> field</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
	<span class="token keyword">let</span> letter_reg <span class="token operator">=</span> <span class="token regex"><span class="token regex-delimiter">/</span><span class="token regex-source language-regex">^[A-Z]$</span><span class="token regex-delimiter">/</span></span><span class="token punctuation">;</span>
	<span class="token keyword">let</span> list <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Array</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
	<span class="token keyword">let</span> letter <span class="token operator">=</span> <span class="token string">''</span><span class="token punctuation">;</span>
	<span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> i <span class="token operator">=</span> <span class="token number">0</span><span class="token punctuation">;</span> i <span class="token operator">&lt;</span> data<span class="token punctuation">.</span>length<span class="token punctuation">;</span> i<span class="token operator">++</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
		<span class="token comment">// 添加 # 分组，用来 存放 首字母不能 转为 大写英文的 数据</span>
		list<span class="token punctuation">[</span><span class="token string">'#'</span><span class="token punctuation">]</span> <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Array</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
		<span class="token comment">// 首字母 转 大写英文</span>
		letter <span class="token operator">=</span> <span class="token punctuation">(</span>data<span class="token punctuation">[</span>i<span class="token punctuation">]</span><span class="token punctuation">[</span>field<span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">substr</span><span class="token punctuation">(</span><span class="token number">0</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">toUpperCase</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
		<span class="token comment">// 是否 大写 英文 字母</span>
		<span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span>letter_reg<span class="token punctuation">.</span><span class="token function">test</span><span class="token punctuation">(</span>letter<span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
			letter <span class="token operator">=</span> <span class="token string">'#'</span><span class="token punctuation">;</span>
		<span class="token punctuation">}</span>
		<span class="token comment">// 创建 字母 分组</span>
		<span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span><span class="token punctuation">(</span>letter <span class="token keyword">in</span> list<span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
			list<span class="token punctuation">[</span>letter<span class="token punctuation">]</span> <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Array</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
		<span class="token punctuation">}</span>
		<span class="token comment">// 字母 分组 添加 数据</span>
		list<span class="token punctuation">[</span>letter<span class="token punctuation">]</span><span class="token punctuation">.</span><span class="token function">push</span><span class="token punctuation">(</span>data<span class="token punctuation">[</span>i<span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
	<span class="token punctuation">}</span>
	<span class="token comment">// 转换 格式 进行 排序；</span>
	<span class="token keyword">var</span> resault <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Array</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
	<span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">var</span> key <span class="token keyword">in</span> list<span class="token punctuation">)</span> <span class="token punctuation">{</span>
		resault<span class="token punctuation">.</span><span class="token function">push</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
			letter<span class="token operator">:</span> key<span class="token punctuation">,</span>
			list<span class="token operator">:</span> list<span class="token punctuation">[</span>key<span class="token punctuation">]</span>
		<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
	<span class="token punctuation">}</span>
	resault<span class="token punctuation">.</span><span class="token function">sort</span><span class="token punctuation">(</span><span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token parameter">x<span class="token punctuation">,</span> y</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
		<span class="token keyword">return</span> x<span class="token punctuation">.</span>letter<span class="token punctuation">.</span><span class="token function">charCodeAt</span><span class="token punctuation">(</span><span class="token number">0</span><span class="token punctuation">)</span> <span class="token operator">-</span> y<span class="token punctuation">.</span>letter<span class="token punctuation">.</span><span class="token function">charCodeAt</span><span class="token punctuation">(</span><span class="token number">0</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
	<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
	<span class="token comment">// # 号分组 放最后</span>
	<span class="token keyword">var</span> last_arr <span class="token operator">=</span> resault<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span><span class="token punctuation">;</span>
	resault<span class="token punctuation">.</span><span class="token function">splice</span><span class="token punctuation">(</span><span class="token number">0</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
	resault<span class="token punctuation">.</span><span class="token function">push</span><span class="token punctuation">(</span>last_arr<span class="token punctuation">)</span><span class="token punctuation">;</span>

	<span class="token comment">// 转换 数据 格式</span>
	<span class="token keyword">var</span> json_sort <span class="token operator">=</span> <span class="token punctuation">{</span><span class="token punctuation">}</span>
	<span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">var</span> i <span class="token operator">=</span> <span class="token number">0</span><span class="token punctuation">;</span> i <span class="token operator">&lt;</span> resault<span class="token punctuation">.</span>length<span class="token punctuation">;</span> i<span class="token operator">++</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
		json_sort<span class="token punctuation">[</span>resault<span class="token punctuation">[</span>i<span class="token punctuation">]</span><span class="token punctuation">.</span>letter<span class="token punctuation">]</span> <span class="token operator">=</span> resault<span class="token punctuation">[</span>i<span class="token punctuation">]</span><span class="token punctuation">.</span>list<span class="token punctuation">;</span>
	<span class="token punctuation">}</span>

	<span class="token keyword">return</span> json_sort<span class="token punctuation">;</span>
<span class="token punctuation">}</span>

<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
	$data_letter_sort<span class="token operator">:</span> data_letter_sort<span class="token punctuation">,</span>
<span class="token punctuation">}</span>
</code></pre></div></div> <footer class="page-edit"><!----> <div class="last-updated"><span class="prefix">最后更新时间:</span> <span class="time">2021-03-12 15:23</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev">
      ←
      <a href="/saas-vuepress/指南/38.common-utils/02.colorGradient.html" class="prev">
        colorGradient
      </a></span> <span class="next"><a href="/saas-vuepress/指南/38.common-utils/04.countDown.html">
        countDown
      </a>
      →
    </span></p></div> </main></div><div class="global-ui"></div></div>
    <script src="/saas-vuepress/assets/js/app.fa9b9339.js" defer></script><script src="/saas-vuepress/assets/js/2.03dacb0b.js" defer></script><script src="/saas-vuepress/assets/js/56.f496ee38.js" defer></script>
  </body>
</html>
